[v-cloak] {
  display: none !important;
}


#app {
  width: 100vw;
  height: 100vh;
  position: relative;
}

.header {
  position: relative;
  width: 100%;
  height: .86rem;
  line-height: .86rem;
  text-align: center;
  background: -webkit-linear-gradient(left, #FFB870, #FB9556);
  background: -o-linear-gradient(right, #FFB870, #FB9556);
  background: -moz-linear-gradient(right, #FFB870, #FB9556);
  background: linear-gradient(to right, #FFB870, #FB9556);
}

.header .back {
  width: .86rem;
  height: .86rem;
  position: absolute;
  display: inline-block;
  left: 0;
  top: 0;
  font-size: .44rem;
  color: #fff;
  text-align: center;
}

.header .title {
  font-size: .32rem;
  color: #fff;
  display: inline-block;
}



/* 日期插件 */

.calendar-wrapper {
  width: 100%;
  height: auto;
  overflow: hidden;
  text-align: center;
  background: #fff;
}

.calendar-wrapper .currentDate {
  padding: .2rem;
  box-sizing: border-box;
  background: #eee;
  color: #333;
  text-align: left;
}

.calendar-table {
  width: 100%;
  height: 100%;
}

.calendar-table .title {
  width: 100%;
  height: .86rem;
  line-height: .86rem;
  display: flex;
  justify-content: space-between;
  background: #FFB870;
  color: #fff;
}

.calendar-table .title li {
  width: 100%;
  display: inline-block;
}


.calendar-table .content-row {
  width: 100%;
  height: 1.44rem;
  line-height: .86rem;
  display: flex;
  justify-content: space-between;
}

.calendar-table .content-row li {
  width: 100%;
  height: 100%;
  display: inline-block;
  border: 1px solid #eee;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
  overflow: hidden;
}


.calendar-table .content-row li .day {
  width: 100%;
  height: .64rem;
  line-height: .64rem;
  position: relative;
  top: .36rem;
  font-weight: bold;
}

.calendar-table .content-row li .tag {
  width: 100%;
  height: .64rem;
  line-height: .64rem;
  margin-top: .2rem;
  color: red;
}

.calendar-table .content-row li .state {
  width: .44rem;
  height: .44rem;
  line-height: .44rem;
  color: #fff;
  text-align: center;
  position: absolute;
  right: 0;
  top: 0;
  background: #FFB870;
}

.calendar-table .content-row li .cur {
  width: .56rem;
  height: .44rem;
  line-height: .44rem;
  position: absolute;
  font-size: .24rem;
  left: 0;
  top: 0;
  color: #666;
}


/* 按钮 */
.btn {
  width: 100%;
  height: .86rem;
  line-height: .86rem;
  text-align: center;
  display: flex;
  justify-content: space-around;
  padding-top: .2rem;
  font-size: .32rem;
  background-color: #eee;
}

.btn .prevMonthBtn {
  width: 40%;
  height: 100%;
  background: #FFB870;
  color: #fff;
}

.btn .nextMonthBtn {
  width: 40%;
  height: 100%;
  background: #FFB870;
  color: #fff;
}